@charset "utf-8";

/* CSS Document */





body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td,b,img{margin:0;padding:0;}

body{

	font: 14px/1.5 微软雅黑,Arial, Helvetica, sans-serif !important; min-width: 1200px;color: #333;}

fieldset,img{border:0}

address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}

ol,li{list-style:none}

h1,h2,h3,h4,h5,h6,b{font-size:100%;font-weight:normal;}

q:before,q:after{content:''}

abbr,acronym{border:0}

input:disabled {background: none;}

textarea{resize:none;outline:none}

a, img {border: 0px none; color: #333;text-decoration: none;}

.clear { clear:both;}

/*---nav---*/

.head {

	width: 98%;

	height: 90px;

	position: absolute;

	z-index: 888;

	overflow: hidden;

	left: 1%;

}

.head-con {

	width: 54%;

	height: 76px;

	float: left;

	/*border: 1px solid red;*/

}

.logo {

	width: 14%;

	margin-left: 8%;

	float: left;

	line-height: 76px;

	height: 76px;

	/* padding-top: 31px; */

}

.logo a{

	display: inline-block;

	line-height: 76px;
	color: #fff;
	font-size: 17px;

}

	.logo a img{

		vertical-align: middle;
		width: 55px;
		margin-top: 20px;
		margin-left: 20px;
	}


.menu {

	float: right;

margin-right: 62px;

line-height: 76px;

}

.menu .cur {

	color: #3aade2;

/*	background:  #15d9db;*/

}

.menu a {

/*

	display: inline-block;

	width: 80px;

	height: 30px;

	margin: 0 15px; 

	border-radius: 15px;

	border: 1px solid #15d9db;

	text-align: center;

*/

	line-height: 30px;

	color: #fff;

	font-size: 18px;

	margin: 0 25px;

}

.menu a:hover {

	color: #3aade2;

/*	background:  #15d9db;*/

	transform: translate(0,2px);

	transition: linear 0.3s;

}



.head-call {

	/*float: right;*/

	float: left;

/*	width: 12%;*/

	height: 76px;

	text-align: right;

	line-height: 76px;

	/*border: 1px solid red;*/

}

.head-call span {

	background: url(../images/head-call.png) no-repeat left center;

	font-size: 18px;

	font-weight: bold;

	font-style: italic;

	color: #fff;

	padding-left: 25px;

	/*margin-right: 40px;*/

}

/*---banner---*/

.banner {

	width: 100%;

/*	height: 842px;*/

	height: 100vh;

	margin: 0 auto;

}

.slideBox{

	height: 100vh;

	width:100%;

	overflow:hidden; 

	position:relative; 

	margin:0 auto;

}

.slideBox .hd{ 

	height:8px; 

	margin: 0 auto;

	position: absolute;

	left: 50%;

	bottom:38px;

	margin-left: -61px;

	z-index:1; 

}

.slideBox .hd ul{ 

	overflow:hidden; 

	zoom:1; 

	float:left;  

}

.slideBox .hd ul li{ 

	float:left; 

	width:18px; 

	height:18px; 

	background:#fff; 

	cursor:pointer;

	border-radius:9px;

	-moz-border-radius: 9px; 

	-webkit-border-radius: 9px;

	margin: 0 8px;

}

.slideBox .hd ul li.on{ 

	background: #15d9db;

	transition: linear 0.3s;

	-webkit-transition: linear 0.3s;

	-moz-transition: linear 0.3s;

	-o-transition: linear 0.3s;

}

.slideBox .bd{ 

	position:relative; 

	width: 100%;

	height: 100vh; 

	z-index:0; 

	margin: 0 auto;

}

.slideBox .bd li{

/*	display: block;*/

	width: 100%;

	height: 100vh;

	zoom:1; 

/*	vertical-align:middle;*/

/*	margin: 0 auto;*/

}

.li-img {

	height: 100vh;

	width: 100%;

	position: absolute;

	overflow: hidden;

}

.li-word {

	width: 1200px;

	height: 100vh;

	margin: 0 auto;

	position: relative;

}

.word-con {

	width: 561px;

	height: 341px;

	background:  url(../images/banner-one.png) no-repeat center;

	text-align: center;

	margin: 0 auto; 

	margin-top: 25%;

	position: relative;

/*

	margin-top: 178px;

	margin-left: 175px;

	float: left;

*/

/*

	position: absolute;

    top: 230px;

    left: 50%;

    margin-left: -490px;

*/

}

.word-con img {

/*	margin-top: 50%;*/

}

img.one1-s {

    position: absolute;

    left: 34px;

	bottom: 90px;

}

img.one2-s {

    position: absolute;

    left: 226px;

	bottom: 90px;

}

img.one3-s {

    position: absolute;

    right: 34px;

	bottom: 90px;

}



.li-zx {

	display: block;

	width: 180px;

	height: 54px;

	position: absolute;

	left: 175px;

	bottom: 74px;

	border-radius: 2px;

	border: 1px solid #15d9db;

	font-size: 24px;

	color: #15d9db;

	text-align: center;

	line-height: 54px;

}

.li-zx:hover {

	color: #333;

	background-color: #15d9db;

	transition: linear 0.5s;

}

/*---page02---*/

.page02 {

	width: 100%;

	height: 900px;

	margin: 0 auto;

	overflow: hidden;

	position: relative;

	background-color: #3498db;

/*	background:  url(../images/page02.jpg) no-repeat center;*/

}

.li-img01 {

	position: absolute;

	width: 100%;

	height: 900px;

	float:left;

	z-index: -1;

	overflow: hidden;

}

.page02-con {

	width: 1200px;

	margin: 0 auto;

}

.page-title {

	vertical-align: middle;

	text-align: center;

	padding-top: 36px;

}

.p1 {

	font-size: 20px;

	color: #fff;

	text-align: center;

	margin-top: 20px;

}

.p2 {

	font-size: 18px;

	color: #fff;

	text-align: center;

}

.s-con {

	margin: 60px 0;

	border: 0;

}

.s-con ul li{

	float: left;

	width: 23%;

	height: 420px;

	margin: 0 1%;

	list-style: none;



}

.image-box {

	margin-top: 102px;

	text-align: center;

	color: #fff;

	height: 358px;

}

.p3 {

	font-size: 20px;

	margin-top: 30px;

}

.p4 {

	font-size: 14px;

	margin: 5px;

}

.p5 {

	font-size: 24px;

	padding-top: 60px;

}

.p6 {

	line-height: 36px;

}

.p7 {

	width:80%;

	margin:0 auto;

	margin-top: 60px;

	text-align: left;

}

.btn{

	display:block;

	width: 114px;

	height: 34px;

	margin: 0 auto;

	text-align: center;

	line-height: 34px;

	color: #026b6a;

	background: #fff;

	margin-top: 60px;

}

.btn:hover{

	background: #3498db;

	color: #fff;

	transition: 0.4s;

}

.text-desc{

	position: absolute;

	left: 0;

	top: 0;

	background-color: #0ba4d0;

	height: 100%;

	opacity: 0;

	width: 100%;

}

.port-1{

	float: left;

	width: 100%;

	height: 100%;

	position: relative;

	overflow: hidden;

	text-align: center;

}

.port-1 .text-desc{

	opacity: 1;

	top: -100%;

	transition: 0.5s;

	color: #fff; }

.port-1 img{

	transition: 0.5s;

}

.port-1:hover img{

	transform: scale(1.2);

}

.port-1.effect-2 .text-desc{

	top: auto;

	bottom: -100%;

}

.port-1.effect-2:hover .text-desc{

	bottom: 0px;

}



/*---page03---*/

.page03 {

	width: 100%;

/*	height: 1280px;*/

	margin: 0 auto;

	overflow: hidden;

	position: relative;

	background-color: #2c2f32;

/*	background:  url(../images/page03.jpg) no-repeat center;*/

}

.li-img02 {

	position: absolute;

	width: 100%;

	height: 1280px;

	float:left;

	z-index: -1;

	overflow: hidden;

}

.page03-con {

/*	width: 1200px;*/

	margin: 0 auto;

}

.c-con {

/*	width: 1200px;*/

	margin: 36px auto;

}

.c-con ul li{

	float: left;

    width: 25%;

/*    height: 300px;*/

/*    margin: 10px 5px;*/

/*

    border: 5px solid #fff;

    border-radius: 14px;

*/

    overflow: hidden;

/*	box-shadow: 0 15px 30px rgba(0,0,0,0.2);*/

	position: relative;

}

.c-con ul li:hover {

/*	transform: translate3d(0,6px,0);*/

	transition: all .5s linear;

}

.port-3{

	float: left;

	width: 100%; 

	position: relative; 

	overflow: hidden; 

	text-align: center;

	perspective: 500px;

/*	border-radius: 8px;*/

}

.port-3 img{

	transition: 0.5s;

	width: 100%;

}

.text-desc1{

	position: absolute;

	left: 0;

	top: 0; 

	background-color: rgba(0,0,0,0.7); 

	height: 100%; 

	opacity: 0; 

	width: 100%; 

	text-align: center;

}

.port-3.effect-2 .text-desc1{

	z-index: 2; 

	transition: 0.5s; 

	transform: rotateX(80deg); 

	transform-origin: center bottom 0; 

	top: auto; 

	bottom: 0; 

}

.port-3.effect-2:hover .text-desc1{

	transform: none;

	opacity: 1;

}

.port-3.effect-2:hover img{

	transform: translateY(-100%)

}

.case-title {

	font-size: 24px;

	color: #fff;

	font-weight: bold;

	margin-top: 80px;

}

.p-line {

	width: 48px;

	height: 6px;

	background-color: #ffc500; 

	margin: 20px auto;

}

.a-more {

	font-size: 12px;

	color: #fff;

}

.a-more:hover {

	color: #ffc500;

	transition: linear 0.5s;

}

.a-case {

	display: block;

	margin: 50px auto;

	width: 240px;

	height: 46px;

	border: 1px solid #fff;

	color: #fff;

	text-align: center;

	line-height: 46px;

/*	margin-top: 50px;*/

}

.a-case:hover {

	color: #15d9db;

	border: 1px solid #15d9db;

	transition: all .5s linear;

}

/*---page04---*/

.page04 {

	width: 100%;

/*	height: 885px;*/

	margin: 0 auto;

	overflow: hidden;

	position: relative;

	background-color: #09837d;

/*	background:  url(../images/page04.jpg) no-repeat center;*/

}

.li-img03 {

	position: absolute;

	width: 100%;

	height: 885px;

	float:left;

	z-index: -1;

	overflow: hidden;

}

.page04-con {

	width: 1200px;

	margin: 0 auto;

}

.n-con {

	width: 1200px;

	margin: 36px auto 120px;

}

.n-con ul li {

	width: 25%;

	height: 176px;

	float: left;

	margin-bottom: 56px ;

	padding: 0 4.16%;

}

.new-title {

	border-bottom: 1px dashed #a1a1a1;

	padding-bottom: 20px;

}

.new-title a{

	display: inline-block;

	width: 100%;

	font-size: 16px;

	color: #fff;

	text-overflow: ellipsis;

	overflow: hidden;

	white-space: nowrap;

}

.new-title a:hover{

	color: #15d9db;

	transition: all .5s linear;

}

.new-des {

	font-size: 12px;

	color: #d4d2d2;

	line-height: 24px;

	padding: 24px 0;

}

.new-date em {

	font-size: 30px;

	font-style: italic;

	color: #d4d2d2;

}

.new-date .line-span {

	display: inline-block;

	width: 40px;

	height: 1px;

	background-color: #d4d2d2;

	line-height: 40px;

	margin: 8px 4px;

}

.new-date .year-span {

	font-size: 18px;

	font-style: italic;

	color: #d4d2d2;

}

.new-a {

	display: inline-block;

	width: 22px;

	height: 16px;

	float: right;

	background: url(../images/new-a.png) no-repeat center;

	margin-top: 18px;

}

.a-new {

    display: block;

    margin: 50px auto;

    width: 240px;

    height: 46px;

    border: 1px solid #fff;

    color: #fff;

    text-align: center;

    line-height: 46px;

}

.a-new:hover {

	color: #15d9db;

	border: 1px solid #15d9db;

	transition: all .5s linear;

}

/*---page05---*/

.page05 {

	width: 100%;

	height: 710px;

	margin: 0 auto;

	overflow: hidden;

	position: relative;

	background: #0a304d;

/*	background:  url(../images/page05.jpg) no-repeat center;*/

}

.li-img04 {

	position: absolute;

	width: 100%;

	height: 885px;

	float:left;

	z-index: -33;

	overflow: hidden;

}

.page05-con {

	width: 1200px;

	margin: 0 auto;

}

.cus-con {

	width: 1200px;

	margin: 36px auto 0;

}

.cus-left {

	width:46%;

	height: 500px;

	float: left;

	position: relative;

}

.left01,.left02,.left03 {

	width: 50%;

    height: 150px;

    margin-left: 88px;

}

.cus-right {

	width:54%;

	height: 500px;
	margin: 0 auto;
	/* float: right; */

}

#iconWall{

    width: 100%;

    margin: 0 auto;

    overflow: hidden;

    padding-top: 1px;

    padding-left: 1px;

    list-style: none;

}



#iconWall li{

    width: 203px;

    height: 138px;

    float: left;

    margin-right: 1px;

    margin-bottom: 1px;

    position: relative;



}

.img-back, .img-front{

    position: absolute;

    left: 0;

    top: 0;

    background-color: #fff;

    width: 203px;

    height: 138px;

    text-align: center;

	display: table-cell; display: table;

}

.img-3d{

    transform-style: preserve-3d;

	text-align: center;

}



.img-back{

    transform: rotateY(180deg);

}

#btnRefresh{

    text-align: center;

    transition: .3s linear;

	cursor: pointer;

	float: right;

	margin-right: 40px;

}

#btnRefresh span {

	display: inline-block;

	height: 28px;

	line-height: 28px;

	color: #fff;

	float: left;

	 margin: 32px auto 0;

}

.iconRefresh{

	display: inline-block;

	width: 28px;

	height: 28px;

	color: #fff;

    background: url("../images/refresh-white.png") no-repeat left center; 

    margin: 32px auto 0;

	float: left;}

.mask{

    position: absolute;

    left: 0;

    top: 0;

    width: 203px;

    height: 138px;

    background-color: rgba(0, 0, 0, .7);

    opacity: 0;

}



.mask img{

    float: right;

    margin-top: 8px;

    margin-right: 8px;

}

.mask a{

    color: #fff;

    text-decoration: none;

    font-size: 12px;

    /*background-color: red;*/

    width: 70px;

    display: block;

    margin: 0 auto;

    text-align: center;

    height: 18px;

    line-height: 18px;

    border-radius: 9px;

}



li:hover .mask{

    opacity: 1;

    transition: .3s linear;

}

/*---page06---*/

.page06 {

	width: 100%;

/*	height: 608px;*/

	margin: 0 auto;

	overflow: hidden;

	position: relative;

/*	background:  url(../images/page06.jpg) no-repeat center;*/

	text-align: center;

	color: #7a889c;

	background: #212930;

}

.li-img05 {

	position: absolute;

	width: 100%;

/*	height: 608px;*/

	float:left;

	z-index: -1;

	overflow: hidden;

}

.page06-con {

	width: 1200px;

	margin: 0 auto;

}

.footer-con {

	width: 1200px;

	margin: 0 auto;

	padding: 60px 0 24px 0;

}

.ft01 {

	font-size: 18px;

	color: #fff;

	text-align: left;

	line-height: 54px;

}

.ft02 {

	font-size: 26px;

	color: #e8de3a;

	background: url(../images/btcall.png) no-repeat left center;

	padding-left: 50px;

	line-height: 40px;

}

.ft03{

	color: #fff;

}

.ft03 span {

	font-size: 18px;

	color: #e8de3a;

}

.ft04 {

	margin-bottom: 10px;

}

.ft06 {

	margin-top: 22px;

}

.ft06 a{

	color: #7a889c;

	padding: 0 10px;

}

.ft06 a:hover {

	color: #15d9db;

	transition: all .5s linear;

}

.ft-line {

	width: 100%;

	height: 1px;

	background-color: #09394d;

}

.ft-bot {

	width: 1200px;

	margin: 28px auto;

}

.bot01 {

	font-size:12px;

}



/*fix-right*/

/*fix-right*/

.rightdiv{

	position:fixed; 

	right:10px; 

	width:50px; 

	bottom:280px; 

	z-index:1;

}

.rightdivs{ 

	width:50px; 

	height:50px;

	margin: 3px 0;

	border-radius: 4px;

	text-align:center; 

	position:relative; 

	cursor:pointer;

	background: #2a84df;

}

.rightdivs a{ 

	display:block; 

	width:0px; 

	overflow:hidden; 

	white-space: nowrap;

	position:absolute; 

	top:0px; 

	right:60px;

	font-size:20px; 

	background:rgba(0,0,0,.3);

	min-height:50px; 

	line-height:50px; 

	color:#36b7e6; 

	transition:linear 0.2s;

	border-radius: 4px;

/*

	-moz-box-shadow: 0 10px 20px rgba(12,103,196,0.2);

	-webkit-box-shadow: 0 10px 20px rgba(12,103,196,0.2);

	box-shadow: 0 10px 20px rgba(12,103,196,0.2);

*/

}

.qq{ 

	background:rgba(0,0,0,.3) url(../images/side-qq.png) no-repeat center;

}

.call{

	font-size: 36px;

	color:#36b7e6; 

	background:rgba(0,0,0,.3) url(../images/side-call.png) no-repeat center;

}

.wx{ 

	background:rgba(0,0,0,.3) url(../images/side-er.png) no-repeat center;

}

.wx a img {

	margin:10px 0;

}

.top{ 

	background:rgba(0,0,0,.3) url(../images/side-top.png) no-repeat center;

}

.qq:hover,.wx:hover,.call:hover,.top:hover{ 

/*	background-color:#ff4500;*/

	transition:linear 0.5s;

}

.rightdivs:hover a{ 

	width:164px; 

	transition:linear 0.3s;

}



.rightdivs:hover a.hov{ 

	width:100px; 

	transition:linear 0.3s;

}

.location .ddimg a {

	padding: 0 10px;

}

.location .ddimg a img{

	display: inline-block;

	vertical-align: middle;

}

.fot-mid {

		width:448px;

		margin:0 auto;

	}

	.fot-left {float:right;}

	.fot-right {float: left; border-right: 1px solid #09394d; padding-right: 52px;}

@keyframes myfont

{

0% {transform:scale(1,1);-webkit-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);}

50% {transform:scale(1.3,1.3);-webkit-transform:scale(1.3,1.3);-moz-transform:scale(1.3,1.3);-o-transform:scale(1.3,1.3);}

100% {transform:scale(1,1);-webkit-transform:scale(1,1);-moz-transform:scale(1,1);-o-transform:scale(1,1);}

}

.font-01 {animation:myfont 1s;-webkit-animation:myfont 1s;-moz-animation:myfont 1;-o-animation:myfont 1s;}

.font-011 {animation-delay:1s;-webkit-animation-delay:1s;-moz-animation-delay:1s;-o-animation-delay:1s;}



.font-02 {animation:myfont 1s;-webkit-animation:myfont 1s;-moz-animation:myfont 1s;-o-animation:myfont 1s;}

.font-022 {animation-delay:1.5s;-webkit-animation-delay:1.5s;-moz-animation-delay:1.5s;-o-animation-delay:1.5s;}

.font-03 {animation:myfont 1s;-webkit-animation:myfont 1s;-moz-animation:myfont 1s;-o-animation:myfont 1s;}

.font-033 {animation-delay:2s;-webkit-animation-delay:2s;-moz-animation-delay:2s;-o-animation-delay:2s;}

.font-04 {animation:myfont 0.5s;-webkit-animation:myfont 0.5s;-moz-animation:myfont 0.5s;-o-animation:myfont 0.5s;}

.font-044 {animation-delay:3.5s;-webkit-animation-delay:3.5s;-moz-animation-delay:3.5s;-o-animation-delay:3.5s;}



